<template>
    <div>
        <h1>显示页面</h1>
        <table class="table">
            <thead>
                <tr>
                    <td><input type="checkbox" v-model="chks" @change="selectchk"></td>
                    <td>编号</td>
                    <td>房屋名称</td>
                     <td>房屋面积</td>
                     <td>房屋状态</td>
                     <td>用户</td>
                              <td>密码</td>
                </tr>
            </thead>
            <tbody>
                <tr v-for="a in dataa">
                    <td><input type="checkbox" v-model="idarry" :value="a.hourseId"></td>
                    <td>{{ a.hourseId }}</td>
                    <td>{{ a.hourseName }}</td>
                    <td>{{ a.hourseNumber }}</td>
                    <td>{{ a.hourseStart==1?"正常":"冻结" }}</td>
                    <td>{{ a.userName }}</td>
                    <td>{{ a.userPwd }}</td>
                    <td><input type="button" value="修改" @click="update(a.hourseId)"></td>
                </tr>
            </tbody>
        </table>
        每页{{ can.pagesize }}条，当前第{{can.pageindex }}页，总共{{ dto.count }}条，总共{{ dto.pageList }}页
        <input type="button" value="首页" @click="FY(1)">
        <input type="button" value="上一页" @click="FY(can.pageindex-1)">
        <input type="button" value="下一页" @click="FY(can.pageindex+1)">
        <input type="button" value="尾页" @click="FY(dto.pageList)">
        <input type="button" value="批量删除" @click="Dels">
    </div>
</template>
<script setup lang="ts">
import axios from 'axios';
import {ref,onMounted} from 'vue';
import {useRouter} from 'vue-router';

const router = useRouter()
//文档就绪
onMounted(()=>{
    Show()
})

const Dels=()=>{
    axios.get("/api/User/PL",{params:{idstring:idarry.value.toString()}}).then(res=>{
        if(res.data>0)
    {
        alert("PL删除成功")
        Show()
    }
    else{
        alert("PL删除失败")
          Show()
    }
    })
}

//定义复选框的数组
const chks = ref(false)
const idarry = ref([])

//全选反选的判断条件
const selectchk=()=>{
    if(chks.value)
    {
        idarry.value=dataa.value.map((i:any)=>{
            return i.hourseId
        })
    }
    else{
        idarry.value=[]
    }
}

const update=(mid:number)=>{
    alert(mid);
    router.push({path:("/Update"),query:{hourseId:mid}});
}

const FY=(a:any)=>{
 if(a>=1 && a<=dto.value.pageList)
 {
    can.value.pageindex=a;
    Show()
 }
}

var dataa = ref({
      hourseId: 0,
      hourseName: "",
      hourseNumber: "",
      hourseStart: 0,
      isDelete: true,
      userId: 0,
      userName: "",
      userPwd: ""
    })

    var can = ref({
start:0,
name:'',
pageindex:1,
pagesize:2
    })
    var dto=ref({
      count:0,
        pageList:0
    })

    const Show=()=>{
        axios.get("/api/User/Show",{params:can.value}).then(res=>{
            dataa.value = res.data.pageList;
            dto.value.count=res.data.count;
            dto.value.pageList= Math.ceil(dto.value.count/can.value.pagesize);
        })
    }


</script>
<style scoped>
</style>